<template>
    <item-card @click.native="goToCustomDetail">
        <template #headerLeft>
            <view class="left">
                <iconsfont customIcons="icon-kehu" :color="mainColor" size="24"></iconsfont>
                <view class="name">{{ item.BName }}</view>
            </view>
        </template>
        <template #headerRight>
            <uni-icons type="forward" size="30"></uni-icons>
        </template>
        <template #content>
            <view class="item">
                <view class="left">期初应收</view>
                <view class="rigth">￥{{ item.WjsTotal }}</view>
            </view>
            <view class="item">
                <view class="left">期末应收</view>
                <view class="rigth">￥{{ item.TotalMoney }}</view>
            </view>
            <view class="item">
                <view class="left">本期增加</view>
                <view class="rigth">￥{{ item.HjTotal }}</view>
            </view>
            <view class="item">
                <view class="left">本期减少</view>
                <view class="rigth">￥{{ item.BdJsTotal }}</view>
            </view>
        </template>
    </item-card>
</template>

<script>
import itemCard from "@/pages_erpA8/components/item-card.vue"

export default {
    components: {
        itemCard,
    },
    props: {
        item: {
            type: Object,
            default: () => ({}),
        },
    },
    data() {
        return {
            mainColor: "",
        }
    },
    created() {
        this.mainColor = this.easyGetColor("main")
    },
    methods: {
        goToCustomDetail() {
            this.easyGoTo(`/pages_erpA8/custom-detail/index?name=${this.item.BName}&code=${this.item.BCode}`)
        },
    },
}
</script>

<style lang="scss">
.left {
    display: flex;
    align-items: center;

    .name {
        margin-left: 6rpx;
        font-weight: 700;
    }
}

.item {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
</style>
